<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>my_car</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="../../plugins/font-awesome/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="../../https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="../../dist/css/adminlte.min.css">
  <!-- iCheck -->
  <link rel="stylesheet" href="../../plugins/iCheck/flat/blue.css">
  <!-- Morris chart -->
  <link rel="stylesheet" href="../../plugins/morris/morris.css">
  <!-- jvectormap -->
  <link rel="stylesheet" href="../../plugins/jvectormap/jquery-jvectormap-1.2.2.css">
  <!-- Date Picker -->
  <link rel="stylesheet" href="../../plugins/datepicker/datepicker3.css">
  <!-- Daterange picker -->
  <link rel="stylesheet" href="../../plugins/daterangepicker/daterangepicker-bs3.css">
  <!-- bootstrap wysihtml5 - text editor -->
  <link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
  <!-- Google Font: Source Sans Pro -->
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
</head>
<body class="hold-transition sidebar-mini">


 <!--  <select >
   	<option>选择营业厅</option>
   	<option></option>
   	
   	
   </select>-->
    
    <div align="left" id="ddivs" style="width:1200px; height:800px;margin-top: 2px;">
	 
	
	 </div>
  

 
<!-- ./wrapper -->

<!-- jQuery -->
<script src="../../plugins/jquery/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
  $.widget.bridge('uibutton', $.ui.button)
</script>
<!-- Bootstrap 4 -->
<script src="../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Morris.js charts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="../../plugins/morris/morris.min.js"></script>
<!-- Sparkline -->
<script src="../../plugins/sparkline/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="../../plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="../../plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="../../plugins/knob/jquery.knob.js"></script>
<!-- daterangepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script src="../../plugins/daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="../../plugins/datepicker/bootstrap-datepicker.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="../../plugins/fastclick/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="../../dist/js/adminlte.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="../../dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../../dist/js/demo.js"></script>
</body>


<style>
	
	#aaa img{
		width:180px;
		height:180px;
		
	}
	
</style>


<script>
	var sz=[];
	/*查询车辆信息*/
	$.ajax({
				 type: "post", //请求方式
				 async: true, //是否异步
				 url: "http://localhost:8071/selectcar",
				 dataType: "json", //跨域json请求一定是jsonp
				 // jsonp: "callback", //跨域请求的参数名，默认是callback
				 //jsonpCallback:"successCallback",    //自定义跨域参数值，回调函数名也是一样，默认为jQuery自动生成的字符串数
				beforeSend: function() {
					 //请求前的处理
					//alert("请求前")
				},success: function(data) {
				   
				 	$.each(data, function(i,d) {
				 		appendPresent(d);
			            sz[i]=d;
					 $("#tab").append("<tr><td>"+data[i].cid+"</td><td>"+data[i].citynumbers+"</td><td>"+data[i].licenseplate+"</td><td>"+data[i].servicelong+"</td><td>"+data[i].photograph+"</td><td>"+data[i].hall.hname+"</td></tr>")
					 });
					 //请求成功处理，和本地回调完全一样
				},		
				 error: function() {
					 //请求出错处理
				}
	});
	
	/*车辆信息*/
	function appendPresent(d){
	$("#ddivs").append("<div>"+
			"<ul >"+
			"<div id='aaa'><img  src='../../dist/img/车辆图片/"+d.photograph+"' ></div>"+
				"<div >"+
					"<p >城市编号:"+
				"	<span><font color='red'>"+d.citynumbers+"</font></span></p>"+
				"<div >"+
				"<p >车牌号："+
				"<span><font color='red'>"+d.licenseplate+"</font></span></p>"+
		     "<p >服役时间:"+
				"<span><font color='red'>"+d.servicelong+"</font></span></p>"+
				 "<p >所属营业厅:"+
				 "<span><font color='red'>"+d.hall.hname+"</font></span></p>"+
				 "<div ><button onclick='deletehall()'>删除</button></div>"+
		"</ol>"+
	"</ul>"+
"</div>  "+
"<hr>");
}

	
</script>

</html>
